<!DOCTYPE html>
<html>
<head>
	<title>轮播图</title>
	<meta charset="utf-8">
	<link href="css/index.css" rel="stylesheet">
</head>
<body>
	<!-- 最外层放轮播图的盒子 -->
	<div class="ban" id="banner">
		<!-- 1放图片 -->
		<div class="picture">
			<img src="img/0.jpg" class="show">
			<img src="img/1.jpg">
			<img src="img/2.jpg">
			<img src="img/3.jpg">
			<img src="img/4.jpg">
		</div>
		<!-- 2放序号原点的 -->
		<ul class="circle" id="dianUl">
			<li class="red">1</li>
			<li>2</li>
			<li>3</li>
			<li>4</li>
			<li>5</li>
		</ul>

		<!-- 3.放左边按钮 -->
		<div class="left-btn btn"></div>
		<!-- 4.放右边按钮 -->
		<div class="right-btn btn"></div>
	</div>


	<script type="text/javascript" src="js/index.js"></script>

	<!-- 完成项目的步骤 
		1.建文件夹，包括css，js，素材文件夹，
		2.创建html，css，js文件
		3.将css，js文件链接到html中并进行检测（css就是给body给个背景色看能否生效，js只需alert(111)能弹出就链接好了）
		4.分析项目所涉及的html的结构，完成html的代码,注意层级结构并写好注释
		5.对照效果图，完成样式，写注释，类名一定要有意义，每个模块的样式写在一起并加好注释，注意多个标签都用到的样式提取一个公共样式，增强代码的复用性
		6.js效果，先看html结构，然后理清思路，写好中文逻辑，填js代码
		

		补充内容：
		1.相对路径
		2.一个标签内可以引多个类样式 写法：class=“类名1 类名2 类名3.....”如果类名中有相同的样式声明时，写在样式表中的后一个类名里的会覆盖上面的
		3.选择器的优先级 标签1分 类10分  id100分  选择器的分值越多 优先级越高  优先级不够时加上祖先的类名，用后代选择器
		
		显示隐藏轮播图思路
		次数      显示      隐藏
		1         0号       1234
		2			1		0234
		3			2		0134
		4			3		0124
		5			4		0123
		6		  0号		1234


	-->
</body>
</html>